import { Module, ActionContext } from 'vuex'
import {
  RootStateTypes,
  StateRoutesListModule,
  AppRouteRecordRaw
} from '../interface/index'
import {
  ModuleState,
  ModuleGetters,
  ModuleActions,
  ModuleMutations
} from '../hooks';

const state: StateRoutesListModule = {
  routesList: [
    {
      meta: {
        title: '首页',
        icon: 'House',
      },
      name: 'Home',
      path: '/home'
    },
    {
      path: '/notice',
      name: 'notice',
      meta: {
        title: '消息',
        icon: 'ChatLineRound'
      },
      children: [
        {
          path: '/notice/messageNotice',
          name: 'MessageNotice',
          meta: {
            title: '消息通知',
            icon: 'ChatLineRound',
          }
        },
        {
          path: '/notice/list',
          name: 'NoticeList',
          meta: {
            title: '通知列表',
            icon: 'ChatLineSquare',
          }
        }
      ]
    }
  ]
}

const getters = {}

const mutations = {
  // 设置路由，菜单中使用到
  getRoutesList(state: StateRoutesListModule, data: Array<AppRouteRecordRaw>) {
    state.routesList = data
  }
}

const actions = {
  // 设置路由，菜单中使用到
  async setRoutesList({ commit }: ActionContext<StateRoutesListModule, RootStateTypes>, data: Array<AppRouteRecordRaw>) {
    commit('getRoutesList', data)
  }
}

type stateKey = typeof state
export type RoutesListState = ModuleState<stateKey>
type gettersKey = typeof getters
export type RoutesListGetters = ModuleGetters<gettersKey>
type mutationKey = typeof mutations
export type RoutesListMutations = ModuleMutations<mutationKey>
type actionKey = typeof actions
export type RoutesListActions = ModuleActions<actionKey>

const routesListModule: Module<StateRoutesListModule, RootStateTypes> = {
  namespaced: true,
  state,
  getters,
  mutations,
  actions
}

export default routesListModule
